<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8"/>
<title>劲松商城后台</title>
<div th:include="Admin/public/Common::head"></div>
</head>
<body>
<div class="main-wrap">
	<div th:include="Admin/public/Common::menu"></div>
	<div class="content-wrap">
<div th:replace="Admin/public/Common::header"></div>
		<main class="main-cont content mCustomScrollbar">
			<div class="page-wrap">
				<!--开始::内容-->
				<section class="page-hd">
					<header>
						<h2 class="title">进度条</h2>
						<p class="title-description">
							HTML5 progress进度条，内部写入防止部分浏览器不是别。
						</p>
					</header>
					<hr>
				</section>
				<div class="panel panel-default">
					<div class="panel-hd">进度条</div>
					<div class="panel-bd">
						<progress value="35" max="100">
							<span class="progress" style="width:100%;">
								<i class="value" style="width:35%;"></i>
							</span>
						</progress>
					</div>
				</div>
				<div class="panel panel-default">
					<div class="panel-hd">步骤样式一</div>
					<div class="panel-bd">
						<div class="step-progress">
							<ul>
								<li class="progressing">
									<span>第一步</span>
								</li>
								<li class="progressing">
									<span>第二步</span>
								</li>
								<li>
									<span>第三步</span>
								</li>
								<li>
									<span>第四步</span>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="panel panel-default">
					<div class="panel-hd">步骤样式二</div>
					<div class="panel-bd">
						<div class="serial-number">
							<ul>
								<li class="progressing">
									<span>首先</span>
								</li>
								<li class="progressing">
									<span>其次</span>
								</li>
								<li class="progressing">
									<span>再次</span>
								</li>
								<li>
									<span>最后</span>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<!--开始::结束-->
			</div>
		</main>
		<div th:replace="Admin/public/Common::footer"></div>
	</div>
</div>
</body>
</html>
